<!--  -->
<template>
  <div>
    <el-table
      :data="list"
      stripe
      style="width: 100%"
      :highlight-current-row="false"
      :border="true"
      class="task-list-table"
      header-row-class-name="common-list-table-header taks-list-table-header"
      ref="multipleTable"
    >
      <template v-if="dataType == 'part'">
        <el-table-column
          show-overflow-tooltip
          prop="serialNumber"
          :label="$t('common.fields.serialNumber.displayName')"
          width="180"
        >
          <template slot-scope="scope">
            <sample-tooltip :row="scope.row">
              <template slot="content" slot-scope="{ isContentTooltip }">
                <el-tooltip
                  :content="scope.row.serialNumber"
                  placement="top"
                  :disabled="!isContentTooltip"
                >
                  <a
                    href=""
                    class="view-detail-btn"
                    @click.stop.prevent="openMenuTab(scope.row.id)"
                  >
                    {{ scope.row.serialNumber }}
                  </a>
                </el-tooltip>
              </template>
            </sample-tooltip>
          </template>
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          prop="name"
          :label="$t('common.base.name')"
          width="180"
        >
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="type" :label="$t('product.component.miniTable.partType.type')">
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="standard" :label="$t('product.component.miniTable.partType.standard')">
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="unit" :label="$t('product.component.miniTable.partType.unit')">
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="salePrice" :label="$t('product.component.miniTable.partType.salePrice')">
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="costPrice" :label="$t('product.component.miniTable.partType.costPrice')">
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="description" :label="$t('product.component.miniTable.partType.description')">
        </el-table-column>
      </template>
      <template v-if="dataType == 'wiki'">
        <el-table-column
          prop="title"
          :label="$t('common.base.title')"
          width="180"
        >
          <template slot-scope="scope">
            <sample-tooltip :row="scope.row">
              <template slot="content" slot-scope="{ isContentTooltip }">
                <el-tooltip
                  :content="scope.row.title"
                  placement="top"
                  :disabled="!isContentTooltip"
                >
                  <a
                    href=""
                    class="view-detail-btn"
                    @click.stop.prevent="openMenuTab(scope.row.id)"
                  >
                    {{ scope.row.title }}
                  </a>
                </el-tooltip>
              </template>
            </sample-tooltip>
          </template>
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          prop="type"
          :label="$t('product.component.miniTable.wikiType.type')"
          width="180"
        >
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          prop="createUserName"
          :label="$t('common.base.createUser')"
        >
        </el-table-column>
      </template>

      <el-table-column show-overflow-tooltip prop="createTime" :label="$t('common.base.createTime')">
        <template slot-scope="scope">
          {{ scope.row.createTime | formatDate }}
        </template>
      </el-table-column>
      <el-table-column
        show-overflow-tooltip
        prop="address"
        :label="$t('common.fields.action.displayName')"
        fixed="right"
      >
        <template slot-scope="scope">
          <a href class="color-danger" @click.stop.prevent="dlete(scope.row.id)"
          >{{ $t('common.base.delete') }}</a
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { formatDate } from 'pub-bbx-utils';
import { openAccurateTab } from '@src/util/platform'
import { PageRoutesTypeEnum } from 'pub-bbx-global/pageType/dist/enum/PageRoutesEnum'

export default {
  name: 'create-mini-table',
  props: {
    dataType: {
      type: String,
    },
    list:{
      type:Array,
      default:()=>[]
    }
  },
  filters: {
    formatDate(val) {
      if (!val) return '';
      return formatDate(val, 'YYYY-MM-DD HH:mm:ss');
    },
  },
  data() {
    return {
    };
  },
  methods: {
    dlete(id) {
      this.$emit('delete',id,this.dataType);
    },
    openMenuTab(id) {
      let fromId = '';
      try {
        fromId = window.frameElement.getAttribute('id');
      } catch (error) {}
      openAccurateTab({
        type: this.dataType == 'part' ? PageRoutesTypeEnum.PagePartCategoryDetail : PageRoutesTypeEnum.PageWikiDetail,
        key:id,
        params: `${this.dataType == 'part' ? 'id' : 'wikiId'}=${id}`,
        fromId
      })
    },
  },
};
</script>
<style lang="scss" scoped>
.table-footer {
  margin-top: 12px;
}
</style>
